ASP.Net MVC এবং ASP.Net Core অ্যাপ্লিকেশনে ফর্ম হ্যান্ডলিং এবং ভ্যালিডেশন অত্যন্ত গুরুত্বপূর্ণ। এগুলির মাধ্যমে ইউজারদের ইনপুট গ্রহণ করা হয় এবং তা সঠিকতা যাচাই করা হয়। এই প্রক্রিয়া নিশ্চিত করে যে, ইউজার সঠিক তথ্য প্রদান করছে এবং তা সঠিকভাবে সার্ভারে পাঠানো হচ্ছে। ASP.Net MVC এবং ASP.Net Core এর ফর্ম হ্যান্ডলিং এবং ভ্যালিডেশন বেশ কিছু সুবিধা প্রদান করে, যেমনঃ

• ডাইনামিক ফর্ম সৃষ্টির সুবিধা
• ইনপুট ভ্যালিডেশন (যেমন, প্রয়োজনীয় ক্ষেত্র, ফর্ম্যাট চেক, রেঞ্জ চেক)
• কাস্টম ভ্যালিডেশন (যেমন, নির্দিষ্ট কন্ডিশন চেক)
• অ্যাপ্লিকেশনের নিরাপত্তা বৃদ্ধি (যেমন, SQL Injection থেকে সুরক্ষা)

ফর্ম হ্যান্ডলিং

ASP.Net MVC এবং ASP.Net Core ফর্ম হ্যান্ডলিংয়ে একটি নির্দিষ্ট রুটিন অনুসরণ করে, যেখানে GET এবং POST পদ্ধতির মাধ্যমে ইউজার ইনপুট নেয়া এবং প্রক্রিয়া করা হয়।

১. ফর্ম তৈরি করা

একটি সাধারণ HTML ফর্ম Razor ভিউতে এইভাবে তৈরি করা যেতে পারে:

HTML ফর্ম (Razor):

@model MyApp.Models.User

<h2>Sign Up</h2>

<form method="post" asp-action="Register">
    <div>
        <label for="Name">Name:</label>
        <input type="text" id="Name" name="Name" value="@Model.Name" />
    </div>
    <div>
        <label for="Email">Email:</label>
        <input type="email" id="Email" name="Email" value="@Model.Email" />
    </div>
    <div>
        <label for="Password">Password:</label>
        <input type="password" id="Password" name="Password" value="@Model.Password" />
    </div>
    <button type="submit">Register</button>
</form>

এখানে, form ট্যাগটি method="post" সহ দিয়ে দেওয়া হয়েছে যাতে ফর্ম সাবমিট করা হলে এটি POST পদ্ধতিতে পাঠানো হয়।

২. Controller অ্যাকশন

ফর্ম সাবমিট করার পর ডাটা প্রক্রিয়া করতে Controller তে একটি POST অ্যাকশন তৈরি করতে হয়।

Controller Example:

public class AccountController : Controller
{
    [HttpPost]
    public IActionResult Register(User user)
    {
        if (ModelState.IsValid)
        {
            // এখানে ডাটাবেসে ইউজার সেভ করা হবে
            return RedirectToAction("Welcome");
        }
        return View(user);  // যদি ভ্যালিডেশন ফেল হয়, ফর্ম আবার প্রদর্শিত হবে
    }
}

এখানে, User মডেলটির ডেটা Register অ্যাকশনে চলে আসে। ModelState.IsValid চেক করে যদি সমস্ত ভ্যালিডেশন ঠিক থাকে, তবে ডেটা সেভ করা হয়।

ফর্ম ভ্যালিডেশন

ফর্ম ভ্যালিডেশন একটি গুরুত্বপূর্ণ অংশ যা ইনপুট ডেটা যাচাই করার প্রক্রিয়া। ASP.Net MVC এবং ASP.Net Core ভ্যালিডেশনের জন্য দুটি প্রকার ব্যবহার করা হয়:

1. ডেটা অ্যানোটেশন (Data Annotations)
2. কাস্টম ভ্যালিডেশন

১. ডেটা অ্যানোটেশন (Data Annotations)

ডেটা অ্যানোটেশনগুলি Model ক্লাসে ব্যবহার করা হয়। এই অ্যানোটেশনগুলির মাধ্যমে, আপনি বিভিন্ন ধরণের ভ্যালিডেশন যেমন, প্রয়োজনীয়তা চেক, ইমেইল ফরম্যাট চেক, রেঞ্জ চেক ইত্যাদি করতে পারেন।

ডেটা অ্যানোটেশন উদাহরণ:

public class User
{
    [Required(ErrorMessage = "Name is required.")]
    public string Name { get; set; }

    [Required(ErrorMessage = "Email is required.")]
    [EmailAddress(ErrorMessage = "Invalid Email Address.")]
    public string Email { get; set; }

    [Required(ErrorMessage = "Password is required.")]
    [StringLength(100, MinimumLength = 6, ErrorMessage = "Password must be at least 6 characters long.")]
    public string Password { get; set; }
}

এখানে:

• [Required] চেক করবে যে ইনপুট ফিল্ডটি খালি না থাকে।
• [EmailAddress] চেক করবে যে ইনপুটটি বৈধ ইমেইল ঠিকানার ফরম্যাটে আছে কিনা।
• [StringLength] চেক করবে যে পাসওয়ার্ডের দৈর্ঘ্য 6 এর কম না হয়।

২. ভ্যালিডেশন ফলাফল প্রদর্শন

ভ্যালিডেশন ফলাফলটি View তে প্রদর্শন করার জন্য, Razor ভিউতে ValidationSummary এবং ValidationMessageFor ব্যবহার করা হয়।

ভ্যালিডেশন ফলাফল প্রদর্শন (Razor):

<form method="post" asp-action="Register">
    <div>
        <label for="Name">Name:</label>
        <input type="text" id="Name" name="Name" value="@Model.Name" />
        <span asp-validation-for="Name" class="text-danger"></span>
    </div>

    <div>
        <label for="Email">Email:</label>
        <input type="email" id="Email" name="Email" value="@Model.Email" />
        <span asp-validation-for="Email" class="text-danger"></span>
    </div>

    <div>
        <label for="Password">Password:</label>
        <input type="password" id="Password" name="Password" value="@Model.Password" />
        <span asp-validation-for="Password" class="text-danger"></span>
    </div>

    <button type="submit">Register</button>
</form>

@* Validation Summary *@
<div asp-validation-summary="All" class="text-danger"></div>

এখানে, asp-validation-for প্রতিটি ইনপুট ফিল্ডের পাশে অ্যাসোসিয়েটেড ভ্যালিডেশন মেসেজ দেখাবে। আর asp-validation-summary সমগ্র ফর্মের জন্য ভ্যালিডেশন মেসেজের সারাংশ দেখাবে।

কাস্টম ভ্যালিডেশন

কিছু ক্ষেত্রে, আপনি কাস্টম ভ্যালিডেশন করতে চাইলে কাস্টম ভ্যালিডেশন অ্যাট্রিবিউট তৈরি করতে পারেন।

কাস্টম ভ্যালিডেশন উদাহরণ:

public class CustomValidationAttribute : ValidationAttribute
{
    public override bool IsValid(object value)
    {
        var email = value as string;
        return email != null && email.EndsWith("@example.com");
    }
}

এখানে, CustomValidationAttribute চেক করবে যে ইউজারের ইমেইল ঠিকানা @example.com এ শেষ হচ্ছে কিনা।

সারাংশ

ফর্ম হ্যান্ডলিং এবং ভ্যালিডেশন ASP.Net অ্যাপ্লিকেশনে ইউজার ইনপুট সঠিকভাবে গ্রহণ এবং প্রক্রিয়া করার জন্য অপরিহার্য। Data Annotations, ValidationMessageFor, এবং ModelState.IsValid ব্যবহার করে সহজেই ইনপুট ভ্যালিডেশন পরিচালনা করা যায়। এছাড়া, কাস্টম ভ্যালিডেশন অ্যাট্রিবিউট দিয়ে আপনি আরও কাস্টম লজিক যোগ করতে পারেন, যা ইউজারের ইনপুটের মান যাচাই করার জন্য আরও বিস্তারিত কনট্রোল প্রদান করে।

ASP.Net এ ফর্ম তৈরি এবং সাবমিট করা একটি গুরুত্বপূর্ণ বিষয়, যা ব্যবহারকারীর ইনপুট সংগ্রহ এবং সেগুলিকে সার্ভারে পাঠানোর জন্য ব্যবহৃত হয়। ASP.Net MVC এবং ASP.Net Core MVC অ্যাপ্লিকেশনগুলিতে ফর্ম তৈরি করা এবং ডেটা সাবমিট করার জন্য Razor এবং HTML ফর্ম ট্যাগ ব্যবহার করা হয়। এই টিউটোরিয়ালে আমরা ASP.Net MVC এবং ASP.Net Core MVC অ্যাপ্লিকেশনে ফর্ম তৈরি এবং সাবমিট করার ধাপগুলো দেখাব।

১. ASP.Net MVC ফর্ম তৈরি এবং সাবমিট করা

Controller - Data Handling

প্রথমে আপনাকে Controller এ ডেটা হ্যান্ডলিং করতে হবে। আমরা একটি সাধারণ Product মডেল ব্যবহার করবো।

public class ProductController : Controller
{
    // GET: Product/Create
    public IActionResult Create()
    {
        return View();
    }

    // POST: Product/Create
    [HttpPost]
    public IActionResult Create(Product model)
    {
        if (ModelState.IsValid)
        {
            // প্রোডাক্ট ডেটা প্রক্রিয়া করুন (যেমন ডাটাবেসে সেভ করা)
            return RedirectToAction("Index"); // Index ভিউতে রিডিরেক্ট করা
        }

        return View(model); // মডেলটি পুনরায় ভিউতে পাঠানো হচ্ছে যদি ভ্যালিডেশন ব্যর্থ হয়
    }
}

এখানে, Create অ্যাকশনটি GET এবং POST উভয় রিকোয়েস্টকে হ্যান্ডল করছে। GET রিকোয়েস্টে ফর্ম পেজ দেখানো হচ্ছে এবং POST রিকোয়েস্টে ডেটা প্রক্রিয়া করা হচ্ছে।

Model - Product

public class Product
{
    public int Id { get; set; }

    [Required]
    public string Name { get; set; }

    [Range(1, 10000, ErrorMessage = "Price must be between 1 and 10000")]
    public decimal Price { get; set; }
}

এখানে, Product মডেলটিতে Name এবং Price প্রপার্টি রয়েছে এবং Price এর জন্য একটি Range ভ্যালিডেশন অ্যাট্রিবিউটও আছে।

View - Create.cshtml (Razor View)

@model YourNamespace.Models.Product

<form method="post">
    <div>
        <label for="Name">Product Name:</label>
        <input type="text" id="Name" name="Name" value="@Model.Name" />
        @Html.ValidationMessageFor(model => model.Name)
    </div>
    <div>
        <label for="Price">Price:</label>
        <input type="text" id="Price" name="Price" value="@Model.Price" />
        @Html.ValidationMessageFor(model => model.Price)
    </div>
    <button type="submit">Submit</button>
</form>

@Html.ValidationSummary(true)

এখানে, @Html.ValidationMessageFor এবং @Html.ValidationSummary ব্যবহার করা হয়েছে যাতে ভ্যালিডেশন ত্রুটি দেখানো যায়। এছাড়াও, POST রিকোয়েস্টে ফর্মটি সাবমিট হবে।

২. ASP.Net Core MVC ফর্ম তৈরি এবং সাবমিট করা

ASP.Net Core MVC তে ফর্ম তৈরি এবং সাবমিট করার জন্য প্রায় একই রকম পদ্ধতি অনুসরণ করা হয়, তবে কিছু পার্থক্য থাকতে পারে যেমন Tag Helpers এর ব্যবহার।

Controller - Data Handling

public class ProductController : Controller
{
    // GET: Product/Create
    public IActionResult Create()
    {
        return View();
    }

    // POST: Product/Create
    [HttpPost]
    public IActionResult Create(Product model)
    {
        if (ModelState.IsValid)
        {
            // প্রোডাক্ট ডেটা প্রক্রিয়া করুন (যেমন ডাটাবেসে সেভ করা)
            return RedirectToAction("Index");
        }

        return View(model);
    }
}

এখানে GET এবং POST অ্যাকশন দুটি একদমই পূর্বের মতো কাজ করছে। Product মডেলটি POST রিকোয়েস্টে হ্যান্ডেল হচ্ছে।

Model - Product

public class Product
{
    public int Id { get; set; }

    [Required]
    public string Name { get; set; }

    [Range(1, 10000, ErrorMessage = "Price must be between 1 and 10000")]
    public decimal Price { get; set; }
}

Product মডেলটি ASP.Net Core MVC তে ভ্যালিডেশন সহ একই রকম থাকবে।

View - Create.cshtml (Razor View)

ASP.Net Core MVC তে Tag Helpers ব্যবহার করা হয় যা Razor ফর্ম তৈরির জন্য সহজ এবং সহজবোধ্য উপায় প্রদান করে।

@model YourNamespace.Models.Product

<form asp-action="Create" method="post">
    <div>
        <label for="Name">Product Name:</label>
        <input asp-for="Name" id="Name" class="form-control" />
        <span asp-validation-for="Name" class="text-danger"></span>
    </div>
    <div>
        <label for="Price">Price:</label>
        <input asp-for="Price" id="Price" class="form-control" />
        <span asp-validation-for="Price" class="text-danger"></span>
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

@Html.ValidationSummary(true)

এখানে:

• asp-for: এটি মডেল প্রপার্টির সাথে ইনপুট ফিল্ডটি সংযুক্ত করে।
• asp-validation-for: এটি সেই ইনপুটের জন্য ভ্যালিডেশন ত্রুটি দেখায়।
• asp-action: এটি ফর্মের সাবমিট অ্যাকশন সেট করে, যেমন Create অ্যাকশন।

৩. জাভাস্ক্রিপ্ট এবং AJAX এর মাধ্যমে ফর্ম সাবমিট

আপনি চাইলে ফর্ম সাবমিট করার জন্য AJAX ব্যবহার করতে পারেন, যাতে পেজ রিলোড না হয়। এটি সাধারণত ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে ব্যবহৃত হয়।

AJAX ফর্ম সাবমিট

<form id="productForm">
    <div>
        <label for="Name">Product Name:</label>
        <input type="text" id="Name" name="Name" />
    </div>
    <div>
        <label for="Price">Price:</label>
        <input type="text" id="Price" name="Price" />
    </div>
    <button type="button" onclick="submitForm()">Submit</button>
</form>

<script>
    function submitForm() {
        var formData = {
            Name: $('#Name').val(),
            Price: $('#Price').val()
        };

        $.ajax({
            type: 'POST',
            url: '/Product/Create',
            data: formData,
            success: function(response) {
                alert('Product created successfully!');
            },
            error: function() {
                alert('Error in form submission');
            }
        });
    }
</script>

এখানে, submitForm() ফাংশনটি AJAX রিকোয়েস্টের মাধ্যমে ফর্মের ডেটা সাবমিট করবে, এবং কোনো পেজ রিলোড ছাড়াই ব্যবহারকারীকে রেসপন্স দেখাবে।

সারাংশ

ASP.Net এবং ASP.Net Core MVC তে ফর্ম তৈরি এবং সাবমিট করার জন্য আমরা Model, View, এবং Controller এর মধ্যে ইন্টারঅ্যাকশন ব্যবহার করি। GET রিকোয়েস্টে ফর্মটি প্রদর্শন করা হয় এবং POST রিকোয়েস্টে ডেটা প্রক্রিয়া করা হয়। AJAX ব্যবহারের মাধ্যমে ফর্ম সাবমিট করা যেতে পারে, যা পেজ রিলোড ছাড়াই ডেটা সাবমিট করতে সাহায্য করে।

Validation একটি গুরুত্বপূর্ণ প্রক্রিয়া যা ব্যবহারকারী ইনপুট যাচাই করার জন্য ব্যবহৃত হয়, যাতে ডেটা সঠিক এবং নিরাপদ থাকে। Client-side validation এবং Server-side validation উভয়ই ওয়েব অ্যাপ্লিকেশনগুলিতে ব্যবহৃত হয়, তবে তাদের কাজ করার পদ্ধতি এবং উদ্দেশ্য ভিন্ন।

ASP.Net এ ডেটা ভ্যালিডেশন করার জন্য বিভিন্ন বিল্ট-ইন কন্ট্রোল এবং ফিচার রয়েছে, যার মাধ্যমে আপনি ব্যবহারকারীর ইনপুট যাচাই করতে পারেন। এই দুটি প্রক্রিয়া সম্পর্কে জানানো হলো।

Client-side Validation

Client-side validation হলো ডেটা যাচাই করার প্রক্রিয়া যা ব্যবহারকারীর ব্রাউজারে ঘটে। এটি JavaScript বা jQuery ব্যবহার করে করা হয় এবং ব্যবহারকারীর ইনপুটটি সার্ভারে পাঠানোর আগে তা যাচাই করা হয়। এটি দ্রুত ফলাফল দেয় এবং ব্যবহারকারীর অভিজ্ঞতা উন্নত করে কারণ এটি সার্ভার রিকোয়েস্ট না করে ইনপুট যাচাই করে।

Client-side validation এর সুবিধা

• দ্রুত প্রতিক্রিয়া: ইনপুট যাচাই ব্রাউজারে সরাসরি হয়, যার ফলে ব্যবহারকারীরা দ্রুত ফলাফল পায়।
• সার্ভার লোড কমানো: সার্ভারে বারবার যাচাইয়ের জন্য রিকোয়েস্ট পাঠানোর প্রয়োজন হয় না।
• ব্যবহারকারীর অভিজ্ঞতা উন্নত করা: ইনপুট ভুল হলে তৎক্ষণাত ত্রুটি মেসেজ দেখা যায়।

ASP.Net এ Client-side Validation উদাহরণ

ASP.Net এ client-side validation সাধারণত Validation Controls ব্যবহার করে করা হয়, যা JavaScript কোডের মাধ্যমে কাজ করে। কিছু জনপ্রিয় ক্লায়েন্ট-সাইড ভ্যালিডেশন কন্ট্রোল যেমন:

• RequiredFieldValidator
• RangeValidator
• RegularExpressionValidator

উদাহরণ:

<form id="form1" runat="server">
    <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator
        ID="rfvUsername" runat="server"
        ControlToValidate="txtUsername"
        ErrorMessage="Username is required"
        ForeColor="Red" />

    <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</form>

এখানে, RequiredFieldValidator কন্ট্রোলটি নিশ্চিত করে যে, txtUsername টেক্সট বক্সটি খালি না থাকে। এটি ব্রাউজারে JavaScript ব্যবহার করে ক্লায়েন্ট-সাইড ভ্যালিডেশন করবে এবং ব্যবহারকারী ভুল ইনপুট দিলে ত্রুটি মেসেজ প্রদর্শন করবে।

Client-side Validation এর সীমাবদ্ধতা

• নিরাপত্তা ঝুঁকি: ক্লায়েন্ট-সাইড ভ্যালিডেশনকে ব্যবহারকারী ব্রাউজারে পরিবর্তন করা যেতে পারে, তাই একে একমাত্র নিরাপত্তার জন্য ব্যবহার করা যাবে না।
• ব্রাউজার নির্ভরতা: JavaScript বা অন্যান্য টুলসের উপর নির্ভরশীল হওয়ায় কিছু পুরোনো ব্রাউজারে সমস্যা হতে পারে।

Server-side Validation

Server-side validation হলো ডেটা যাচাই করার প্রক্রিয়া যা সার্ভারে ঘটে। এটি ব্যবহারকারীর ইনপুট সার্ভারে পাঠানোর পর সেখানে যাচাই করা হয়। Server-side validation সবচেয়ে বেশি নিরাপদ কারণ এটি ক্লায়েন্টের পক্ষ থেকে কোনও পরিবর্তন বা বাইপাস করা সম্ভব নয়। সমস্ত গুরুত্বপূর্ণ এবং নিরাপত্তা সংক্রান্ত যাচাই সার্ভারে করা উচিত।

Server-side validation এর সুবিধা

• নিরাপত্তা: ইনপুট যাচাই করার জন্য সার্ভার ব্যবহার করা হলে, এটি নিরাপদ কারণ এটি ক্লায়েন্ট সাইডে পরিবর্তন করা সম্ভব নয়।
• ডেটার সঠিকতা: সার্ভারে যাচাই করলে, আপনি নিশ্চিত হতে পারেন যে সঠিক ডেটা ডেটাবেসে প্রবাহিত হবে।

ASP.Net এ Server-side Validation উদাহরণ

ASP.Net এ সার্ভার-সাইড ভ্যালিডেশন সাধারণত Validation Controls এবং Custom Validation এর মাধ্যমে করা হয়। এখানে CustomValidator কন্ট্রোলের মাধ্যমে একটি উদাহরণ দেখানো হলো:

<form id="form1" runat="server">
    <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox>
    <asp:CustomValidator
        ID="cvUsername" runat="server"
        ControlToValidate="txtUsername"
        OnServerValidate="cvUsername_ServerValidate"
        ErrorMessage="Username must be at least 5 characters long."
        ForeColor="Red" />

    <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</form>

Server-side validation কোড:

protected void cvUsername_ServerValidate(object source, ServerValidateEventArgs args)
{
    // Custom server-side validation logic
    if (args.Value.Length < 5)
    {
        args.IsValid = false;  // Invalid input if length < 5
    }
    else
    {
        args.IsValid = true;  // Valid input if length >= 5
    }
}

এখানে CustomValidator কন্ট্রোলটি txtUsername টেক্সট বক্সের ইনপুট যাচাই করছে সার্ভারে। এটি ব্যবহারকারী যদি ৫টি অক্ষরের কম ইনপুট দেয়, তবে ত্রুটি মেসেজ দেখাবে।

Server-side Validation এর সীমাবদ্ধতা

• ব্রাউজার রেসপন্স ধীর হতে পারে: ক্লায়েন্ট-সাইডে তৎক্ষণাৎ ফলাফল না পেয়ে সার্ভারের সঙ্গে যোগাযোগের জন্য অতিরিক্ত সময় লাগে।
• সার্ভার লোড: সার্ভার-সাইড ভ্যালিডেশন সবসময় সার্ভারের সাথে যোগাযোগ করে, যা বড় অ্যাপ্লিকেশনে সার্ভারের লোড বাড়াতে পারে।

Client-side এবং Server-side Validation এর মধ্যে পার্থক্য

সারাংশ

• Client-side validation ব্যবহারকারীর অভিজ্ঞতা উন্নত করার জন্য ব্যবহৃত হয়, যেহেতু এটি দ্রুত ফলাফল প্রদান করে। তবে এটি শুধুমাত্র ব্যবহারকারীর ইনপুট যাচাই করার জন্যই যথেষ্ট নয়, নিরাপত্তার জন্য Server-side validation অপরিহার্য।
• Server-side validation হল নিরাপদ এবং নিশ্চিত ইনপুট যাচাইয়ের পদ্ধতি যা গুরুত্বপূর্ণ ডেটার জন্য অবশ্যই প্রয়োজনীয়।
• একসাথে ব্যবহার করলে, আপনি দ্রুত এবং নিরাপদ ডেটা যাচাই নিশ্চিত করতে পারবেন।

Data Annotations হল ASP.Net এ একটি শক্তিশালী ভ্যালিডেশন প্রযুক্তি, যা Model ক্লাসের প্রপার্টির উপর প্রয়োগ করা হয়। এটি UI এবং Controller স্তরে ডেটা ভ্যালিডেশন করতে সাহায্য করে। Data Annotations মূলত .NET Framework এর একটি অংশ এবং Entity Framework সহ ডেটাবেস এবং UI মডেলগুলিতে ব্যবহৃত হয়।

এটি Model-Driven Validation বা Server-Side Validation হিসাবে পরিচিত, যেখানে ডেটা ভ্যালিডেশন ক্লায়েন্টের পক্ষ থেকে না হয়ে, সার্ভারের পক্ষ থেকে হয়।

Data Annotations এর মাধ্যমে ভ্যালিডেশন

Data Annotations কনস্ট্রেইন্ট বা নিয়মাবলী ব্যবহারের মাধ্যমে মডেল ক্লাসের প্রপার্টি ভ্যালিডেশন করতে সাহায্য করে। এটি বিভিন্ন ধরনের ভ্যালিডেশন অ্যাট্রিবিউট প্রদান করে, যেগুলো ডেটার গুণগত মান নিশ্চিত করতে ব্যবহৃত হয়।

এটি মূলত System.ComponentModel.DataAnnotations নেমস্পেসে অন্তর্ভুক্ত থাকে।

Data Annotations এর কিছু জনপ্রিয় অ্যাট্রিবিউট

১. [Required]

এই অ্যাট্রিবিউটটি ব্যবহার করা হয়, যদি কোনো ফিল্ডটি অবশ্যই পূর্ণ করতে হয়। অর্থাৎ, ডেটা সাবমিট করার সময় এটি ফাঁকা রাখা যাবে না।

public class User
{
    [Required(ErrorMessage = "Name is required.")]
    public string Name { get; set; }
}

এখানে, Name ফিল্ডটি অবশ্যই পূর্ণ করতে হবে, অন্যথায় একটি এরর মেসেজ দেখাবে।

২. [StringLength]

এটি ব্যবহার করা হয় কোনো স্ট্রিং প্রপার্টির সর্বোচ্চ এবং সর্বনিম্ন দৈর্ঘ্য নির্ধারণ করতে।

public class User
{
    [StringLength(50, MinimumLength = 5, ErrorMessage = "Username must be between 5 and 50 characters.")]
    public string Username { get; set; }
}

এখানে, Username প্রপার্টির দৈর্ঘ্য ৫ থেকে ৫০ ক্যারেক্টারের মধ্যে থাকতে হবে।

৩. [Range]

এই অ্যাট্রিবিউটটি সংখ্যা, তারিখ বা অন্য কোনো মানের জন্য সীমা নির্ধারণ করতে ব্যবহৃত হয়।

public class Product
{
    [Range(1, 1000, ErrorMessage = "Price must be between 1 and 1000.")]
    public decimal Price { get; set; }
}

এখানে, Price ১ থেকে ১০০০ এর মধ্যে থাকতে হবে।

৪. [EmailAddress]

এটি একটি বৈধ ইমেইল ঠিকানা যাচাই করতে ব্যবহৃত হয়।

public class User
{
    [EmailAddress(ErrorMessage = "Please enter a valid email address.")]
    public string Email { get; set; }
}

এখানে, Email প্রপার্টি একটি বৈধ ইমেইল ঠিকানা হওয়া উচিত।

৫. [Compare]

এই অ্যাট্রিবিউটটি দুটি প্রপার্টি তুলনা করার জন্য ব্যবহৃত হয়। সাধারণত এটি পাসওয়ার্ড এবং কনফার্ম পাসওয়ার্ড ক্ষেত্রের জন্য ব্যবহার করা হয়।

public class User
{
    public string Password { get; set; }
    
    [Compare("Password", ErrorMessage = "Passwords do not match.")]
    public string ConfirmPassword { get; set; }
}

এখানে, Password এবং ConfirmPassword দুটি প্রপার্টি তুলনা করা হবে এবং যদি তারা মেলে না, তাহলে একটি এরর মেসেজ দেখাবে।

৬. [RegularExpression]

এই অ্যাট্রিবিউটটি একটি নির্দিষ্ট প্যাটার্ন অনুসারে ডেটা যাচাই করার জন্য ব্যবহার করা হয়। এটি সাধারণত ফরম্যাট ভ্যালিডেশন জন্য ব্যবহৃত হয় (যেমন: ফোন নম্বর, ZIP কোড ইত্যাদি)।

public class User
{
    [RegularExpression(@"^\d{10}$", ErrorMessage = "Phone number must be 10 digits.")]
    public string PhoneNumber { get; set; }
}

এখানে, PhoneNumber প্রপার্টি অবশ্যই ১০ ডিজিটের হতে হবে।

ASP.Net MVC তে Data Annotations ভ্যালিডেশন

ASP.Net MVC অ্যাপ্লিকেশনগুলিতে Data Annotations ব্যবহার করে ডেটা ভ্যালিডেশন সহজে করা যায়। এই ভ্যালিডেশন প্রপার্টি Model-এ সেট করা হয় এবং তারপর Controller বা View তে যাচাই করা হয়।

উদাহরণ:

1. Model Class:

public class User
{
    [Required(ErrorMessage = "Name is required.")]
    [StringLength(50, MinimumLength = 5, ErrorMessage = "Username must be between 5 and 50 characters.")]
    public string Username { get; set; }

    [EmailAddress(ErrorMessage = "Please enter a valid email address.")]
    public string Email { get; set; }

    [Required]
    [Compare("Password", ErrorMessage = "Passwords do not match.")]
    public string ConfirmPassword { get; set; }

    public string Password { get; set; }
}

2. Controller:

public class UserController : Controller
{
    [HttpPost]
    public IActionResult Register(User user)
    {
        if (ModelState.IsValid)
        {
            // Logic for registering the user
            return RedirectToAction("Success");
        }
        return View(user);
    }
}

3. View (Register.cshtml):

@model User

<form method="post">
    <label for="Username">Username</label>
    <input type="text" name="Username" id="Username" />
    @Html.ValidationMessageFor(model => model.Username)

    <label for="Email">Email</label>
    <input type="text" name="Email" id="Email" />
    @Html.ValidationMessageFor(model => model.Email)

    <label for="Password">Password</label>
    <input type="password" name="Password" id="Password" />
    
    <label for="ConfirmPassword">Confirm Password</label>
    <input type="password" name="ConfirmPassword" id="ConfirmPassword" />
    @Html.ValidationMessageFor(model => model.ConfirmPassword)

    <button type="submit">Register</button>
</form>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

এখানে, ModelState.IsValid চেক করে দেখে যে সমস্ত ভ্যালিডেশন সঠিকভাবে সম্পন্ন হয়েছে কিনা। যদি কোনো ভুল থাকে, তাহলে ফর্মটি পুনরায় ভ্যালিডেশন সহ রেন্ডার হবে।

সারাংশ

Data Annotations এর মাধ্যমে ASP.Net অ্যাপ্লিকেশনগুলোতে সহজে ডেটা ভ্যালিডেশন করা যায়। এটি ক্লায়েন্ট-সাইড এবং সার্ভার-সাইড ভ্যালিডেশন সমর্থন করে, এবং ডেভেলপারদের জন্য কার্যকরীভাবে সঠিক ডেটা ইনপুট নিশ্চিত করতে সহায়ক। Data Annotations ব্যবহার করে একটি মডেল ক্লাসে ভ্যালিডেশন কনস্ট্রেইন্ট যোগ করা সহজ, যা অ্যাপ্লিকেশনের ডেটা ইন্টিগ্রিটি বজায় রাখতে সাহায্য করে।

AJAX (Asynchronous JavaScript and XML) হল একটি প্রযুক্তি যা ব্যবহারকারীর ইন্টারফেসের সাথে সিঙ্ক্রোনাস রিফ্রেশ ছাড়াই ডেটা পাঠানো এবং গ্রহণ করার সুযোগ দেয়। ASP.Net অ্যাপ্লিকেশনে AJAX ব্যবহার করে ফর্ম সাবমিট করা একটি জনপ্রিয় পদ্ধতি, কারণ এটি ব্যবহারকারীর অভিজ্ঞতা উন্নত করে এবং পেজ রিফ্রেশ ছাড়াই ডেটা প্রসেসিং করে।

এখানে, ASP.Net এ AJAX ব্যবহার করে ফর্ম সাবমিট করার প্রক্রিয়া ব্যাখ্যা করা হলো।

১. ASP.Net অ্যাপে AJAX সেটআপ

ASP.Net এ AJAX ব্যবহারের জন্য, আপনাকে AJAX Control Toolkit অথবা jQuery AJAX ব্যবহার করতে হবে। এখানে আমরা jQuery AJAX এর মাধ্যমে ফর্ম সাবমিট করার প্রক্রিয়া দেখব, যেটি সহজ এবং জনপ্রিয় পদ্ধতি।

jQuery AJAX ব্যবহার করে ফর্ম সাবমিট

1. jQuery যুক্ত করা: প্রথমে আপনাকে আপনার ভিউ ফাইলে jQuery লাইব্রেরি যুক্ত করতে হবে। এটি সাধারণত Layout.cshtml বা সংশ্লিষ্ট ভিউতে করা হয়।

   <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
   

2. HTML ফর্ম তৈরি করা: একটি সাধারণ HTML ফর্ম তৈরি করুন, যেখানে ব্যবহারকারী ডেটা ইনপুট করবে।

   <form id="myForm">
       <label for="name">Name:</label>
       <input type="text" id="name" name="name" />
       <label for="email">Email:</label>
       <input type="email" id="email" name="email" />
       <button type="submit" id="submitBtn">Submit</button>
   </form>
   
   <div id="responseMessage"></div>
   

3. jQuery AJAX কোড লিখুন: submit ইভেন্টের মাধ্যমে AJAX কল তৈরি করা হয়। এখানে আপনি AJAX রিকোয়েস্ট পাঠাবেন, এবং রেসপন্স পাওয়ার পর সেই রেসপন্স ডেটা ব্যবহারকারীর কাছে দেখাবেন।

   <script>
       $(document).ready(function () {
           $("#myForm").submit(function (event) {
               event.preventDefault();  // ফর্মের ডিফল্ট সাবমিশন ব্লক করা
               
               // ফর্ম ডেটা সংগ্রহ
               var formData = $(this).serialize();
   
               // AJAX কল
               $.ajax({
                   url: '/Home/SubmitForm',  // কন্ট্রোলারের অ্যাকশন মেথড
                   type: 'POST',
                   data: formData,
                   success: function (response) {
                       // রেসপন্স পাওয়ার পর কিছু করুন
                       $("#responseMessage").html(response);  // রেসপন্স ডেটা ভিউতে দেখানো
                   },
                   error: function () {
                       $("#responseMessage").html("There was an error processing your request.");
                   }
               });
           });
       });
   </script>
   

এখানে, আমরা submit ইভেন্টের মাধ্যমে AJAX কল করছি। serialize() ফাংশন ব্যবহার করে ফর্মের ডেটা সংগ্রহ করা হচ্ছে এবং POST রিকোয়েস্টের মাধ্যমে সার্ভারে পাঠানো হচ্ছে। সার্ভার থেকে সাড়া পাওয়ার পর, সেই সাড়া ব্যবহারকারীর কাছে প্রদর্শিত হবে।

২. কন্ট্রোলার অ্যাকশন তৈরি করা

এখন ASP.Net কন্ট্রোলারে একটি অ্যাকশন মেথড তৈরি করতে হবে, যা AJAX রিকোয়েস্ট গ্রহণ করবে এবং ডেটা প্রসেস করবে।

কন্ট্রোলার (HomeController.cs):

public class HomeController : Controller
{
    [HttpPost]
    public IActionResult SubmitForm(string name, string email)
    {
        // ডেটা প্রসেসিং করতে পারেন এখানে
        if (string.IsNullOrEmpty(name) || string.IsNullOrEmpty(email))
        {
            return Json("Please fill in all fields.");
        }
        
        // সফল হলে, প্রোফাইল পৃষ্ঠায় বা অন্য কোথাও রিডিরেক্ট বা মেসেজ পাঠাতে পারেন
        return Json("Form submitted successfully! Name: " + name + ", Email: " + email);
    }
}

এখানে, আমরা SubmitForm অ্যাকশন মেথড তৈরি করেছি যা name এবং email প্যারামিটার গ্রহণ করে। সফলভাবে ডেটা প্রক্রিয়া হলে, এটি একটি JSON রেসপন্স পাঠাবে।

৩. ফর্ম সাবমিট হওয়ার পর রেসপন্স প্রদর্শন

যখন ফর্ম সাবমিট করা হবে, তখন AJAX কল সার্ভারে পৌঁছাবে এবং SubmitForm অ্যাকশন মেথডে ডেটা যাবে। রেসপন্স সঠিকভাবে পাওয়ার পর, সেই রেসপন্স ডেটা #responseMessage ডিভে প্রদর্শিত হবে।

৪. সম্পূর্ণ উদাহরণ

HTML + jQuery:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AJAX Form Submit</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>

    <form id="myForm">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" required />
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" required />
        <button type="submit" id="submitBtn">Submit</button>
    </form>

    <div id="responseMessage"></div>

    <script>
        $(document).ready(function () {
            $("#myForm").submit(function (event) {
                event.preventDefault();
                var formData = $(this).serialize();

                $.ajax({
                    url: '/Home/SubmitForm',
                    type: 'POST',
                    data: formData,
                    success: function (response) {
                        $("#responseMessage").html(response);
                    },
                    error: function () {
                        $("#responseMessage").html("There was an error processing your request.");
                    }
                });
            });
        });
    </script>

</body>
</html>

C# Controller:

public class HomeController : Controller
{
    [HttpPost]
    public IActionResult SubmitForm(string name, string email)
    {
        if (string.IsNullOrEmpty(name) || string.IsNullOrEmpty(email))
        {
            return Json("Please fill in all fields.");
        }

        return Json("Form submitted successfully! Name: " + name + ", Email: " + email);
    }
}

সারাংশ

AJAX ব্যবহার করে ফর্ম সাবমিট করার মাধ্যমে পেজ রিফ্রেশ ছাড়াই ডেটা প্রেরণ এবং গ্রহণ করা সম্ভব। jQuery AJAX কোডের মাধ্যমে, ফর্ম ডেটা সঠিকভাবে প্রসেস করা হয় এবং ব্যবহারকারীকে সাড়া প্রদান করা হয়, যা একযোগে একটি চমৎকার ইন্টারঅ্যাকটিভ ওয়েব অ্যাপ্লিকেশন তৈরি করতে সাহায্য করে।

ASP.Net অ্যাপ্লিকেশনগুলিতে ModelState এবং Validation Summary গুরুত্বপূর্ণ ভূমিকা পালন করে ব্যবহারকারীর ইনপুট যাচাই করতে। এগুলি মূলত Validation প্রক্রিয়ার অংশ, যা নিশ্চিত করে যে ব্যবহারকারীর দেওয়া ডেটা সঠিক এবং নিরাপদ।

ModelState কী?

ModelState হলো ASP.Net MVC এবং ASP.Net Core MVC এর একটি বিল্ট-ইন ডেটা স্ট্রাকচার যা ফর্ম ডেটার বৈধতা যাচাই করার জন্য ব্যবহৃত হয়। এটি ফর্ম ডেটার উপর প্রযোজ্য সমস্ত ভ্যালিডেশন ফলাফল (যেমন: কোন ইনপুট ফিল্ড ভুলভাবে পূর্ণ করা হয়েছে বা কোনও বাধ্যতামূলক ক্ষেত্র ফাঁকা রাখা হয়েছে) ধারণ করে। এটি একটি ডিকশনারি যা মডেল প্রপার্টির নাম এবং সংশ্লিষ্ট ত্রুটির তালিকা সংরক্ষণ করে।

ModelState এর ব্যবহারের উদ্দেশ্য:

• ব্যবহারকারীর ইনপুট যাচাই করা।
• ত্রুটিগুলি অ্যাক্সেস এবং প্রক্রিয়া করা।
• Validation প্রক্রিয়ায় সফল হলে ডেটা গ্রহণ করা।

ModelState Validation কিভাবে কাজ করে?

ModelState সাধারণত কন্ট্রোলারে POST অ্যাকশন মেথডে ব্যবহৃত হয়, যেখানে Model Binding এর মাধ্যমে ক্লায়েন্ট থেকে প্রাপ্ত ইনপুট ভ্যালু Model ক্লাসে মডেল বাইন্ড করা হয় এবং ModelState তে সেগুলোর বৈধতা যাচাই করা হয়।

উদাহরণ:

ধরা যাক, আপনার একটি Product মডেল রয়েছে যা ব্যবহারকারী থেকে ইনপুট নেবে।

public class Product
{
    [Required(ErrorMessage = "Product Name is required.")]
    public string Name { get; set; }

    [Range(1, 10000, ErrorMessage = "Price must be between 1 and 10000.")]
    public decimal Price { get; set; }
}

এখন, POST অ্যাকশন মেথডে ModelState যাচাই করুন:

[HttpPost]
public IActionResult Create(Product product)
{
    if (ModelState.IsValid)
    {
        // ডেটা সেভ করুন
        return RedirectToAction("Index");
    }
    
    // ModelState ত্রুটি থাকলে পুনরায় ফর্মে ফেরত পাঠান
    return View(product);
}

এখানে, ModelState.IsValid চেক করবে যে মডেলটি বৈধ কিনা। যদি না হয়, তাহলে সেই ত্রুটিগুলি ব্যবহারকারীকে দেখানো হবে।

Validation Summary ব্যবহার

Validation Summary হলো একটি View Helper যা সমস্ত ModelState ত্রুটির তালিকা একটি উপস্থাপনযোগ্য ফরম্যাটে দেখায়। এটি সাধারণত Razor Views এ ব্যবহৃত হয় যাতে ব্যবহারকারীকে সমস্ত ফর্ম ত্রুটি একত্রে দেখানো যায়।

উদাহরণ:

@model Product

<h2>Create Product</h2>

<form method="post">
    @if (!ViewData.ModelState.IsValid)
    {
        <div class="alert alert-danger">
            @Html.ValidationSummary(true)
        </div>
    }

    <div>
        <label>Product Name</label>
        <input type="text" name="Name" />
        @Html.ValidationMessageFor(m => m.Name)
    </div>
    
    <div>
        <label>Price</label>
        <input type="number" name="Price" />
        @Html.ValidationMessageFor(m => m.Price)
    </div>
    
    <button type="submit">Create</button>
</form>

@Html.ValidationSummary(true) ব্যাখ্যা:

• এই ট্যাগটি সমস্ত ত্রুটির সারাংশ প্রদর্শন করবে।
• true প্যারামিটার ব্যবহার করলে শুধুমাত্র মোট ত্রুটিগুলি (নির্দিষ্ট ফিল্ড ত্রুটিগুলির পাশাপাশি) শো করবে।

@Html.ValidationMessageFor(m => m.Name) ব্যাখ্যা:

• নির্দিষ্ট Model প্রপার্টির জন্য ত্রুটি বার্তা প্রদর্শন করবে। এটি প্রতিটি ইনপুট ফিল্ডের জন্য ModelState থেকে ত্রুটি দেখানোর জন্য ব্যবহৃত হয়।

ModelState এর জন্য সাধারণ Validation Attributes

ASP.Net MVC বা ASP.Net Core MVC এর সাথে সাধারণভাবে ব্যবহৃত কিছু Validation Attributes:

• [Required]: ফিল্ডটি খালি থাকতে পারে না।
• [StringLength]: ইনপুটের দৈর্ঘ্য সীমাবদ্ধ করে।
• [Range]: মানের পরিসীমা নির্ধারণ করে।
• [EmailAddress]: একটি বৈধ ইমেইল ঠিকানা যাচাই করে।
• [RegularExpression]: একটি নির্দিষ্ট প্যাটার্ন বা রেগুলার এক্সপ্রেশন অনুসারে ইনপুট যাচাই করে।
• [Compare]: দুটি ফিল্ডের মান তুলনা করে (যেমন, পাসওয়ার্ড এবং কনফার্ম পাসওয়ার্ড)।

সারাংশ

ModelState এবং Validation Summary ব্যবহার করার মাধ্যমে ASP.Net অ্যাপ্লিকেশনগুলোতে ব্যবহারকারী ইনপুট যাচাই করা সহজ হয়। এটি সঠিক এবং নিরাপদ ডেটা নিশ্চিত করতে সাহায্য করে এবং ত্রুটিগুলি ব্যবহারকারীকে স্পষ্টভাবে দেখানোর সুযোগ দেয়।